<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">

    <f:view contentType="text/html">
        <h:head>
            <f:facet name="first">
                <meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
                <title>.::AsPerA::. Asignación de Permisos de Aprendices</title>
                <link rel="shortcut icon" href="favicon.ico"/>
            </f:facet>
        </h:head>
        <h:body>
            <div>
                <h:graphicImage url="/aspera/images/aspera.jpg" width="100%" height="100%" alt="LogoAspera"  style="vertical-align: top;"/> 
            </div>

            <p:panel>
                <p:panelGrid> 
                    <p:row>
                        <p:column style="vertical-align: top;">
                            <h:form>
                                <p:menu>
                                    <p:submenu label="Menú">                                
                                        <p:menuitem value="Inicio" url="/faces/aspera/indexCoordinador.xhtml" />
                                        <p:menuitem value="Coordinadores" url="/faces/aspera/GestionCoordinador.xhtml" />
                                        <p:menuitem value="Permisos" url="/faces/aspera/ApruebaPermisosCoord.xhtml" />
                                        <p:menuitem value="Instructores" url="/faces/aspera/gestionInstructores.xhtml" />
                                        <p:menuitem value="Asignar Fichas" url="/faces/aspera/asignarFichas.xhtml" />
                                        <p:menuitem value="Programas" url="/faces/aspera/gestionProgramas.xhtml" />
                                        <p:menuitem value="Fichas" url="/faces/aspera/gestionFichas.xhtml" />     
                                        <p:menuitem value="Aprendices" url="/faces/aspera/gestionAprendices.xhtml" />
                                        <p:menuitem value="Reportes" url="/faces/aspera/Reportes.xhtml" />
                                        <p:menuitem value="Cambio Contraseña" url="/faces/aspera/CambiaPasswordCoord.xhtml" />
                                        <p:menuitem value="Cerrar Sesión" actionListener="#{usuariosVista.cerrarSesion_action}" />
                                    </p:submenu>                      
                                </p:menu>
                            </h:form>
                        </p:column>
                        <p:column>

                            <h:form id="formulario"> 
                                <p:panel id="panelFichas" header="Titulaciones">
                                    <p:focus context="panelFichas"/>
                                    <p:messages id="mensajes" showDetail="true" />
                                    <f:facet name="actions">
                                        <p:commandLink onclick="PF('helpDialog').show();" styleClass="ui-panel-titlebar-icon ui-corner-all ui-state-default"><h:outputText styleClass="ui-icon ui-icon-help" /></p:commandLink>
                                    </f:facet>
                                    <p:panelGrid  columns="4" id="panelFicha">
                                        <h:outputText value="Ficha:"/>
                                        <p:inputText id="txtFicha" binding="#{fichasVista.txtFicha}">
                                            <p:ajax listener="#{fichasVista.txtFicha_listener}" update="panelFicha" />
                                            <p:tooltip for="txtFicha" value="Digite La Ficha y Presione TAB" showEffect="slide" hideEffect="slide" />
                                        </p:inputText>

                                        <h:outputText value="Código Programa:"/>
                                        <p:inputText id="txtCodigoPrograma" binding="#{fichasVista.txtCodigoPrograma}">
                                            <p:ajax listener="#{fichasVista.txtPrograma_listener}" update="panelFicha" />
                                        </p:inputText>

                                        <h:outputText value="Jornada:"/>                        
                                        <p:selectOneMenu id="cmbJornadaFicha" binding="#{fichasVista.txtJornada}">
                                            <f:selectItem itemValue="ninguno" itemLabel="-SELECCIONE-" />
                                            <f:selectItem itemValue="MAÑANA" itemLabel="MAÑANA" />
                                            <f:selectItem itemValue="TARDE" itemLabel="TARDE" />
                                            <f:selectItem itemValue="MIXTA" itemLabel="MIXTA" />
                                        </p:selectOneMenu>                            

                                        <h:outputText value="Nombre:"/>
                                        <p:inputText id="txtPrograma" binding="#{fichasVista.txtPrograma}" />

                                        <f:facet name="footer"> 
                                            <div align="center"> 
                                                <p:commandButton id="btnCrear" value="Crear" binding="#{fichasVista.btnRegistrar}" action="#{fichasVista.registrar_action}" update="formulario" />
                                                <p:commandButton id="btnModificar" value="Modificar" binding="#{fichasVista.btnModificar}" action="#{fichasVista.modificar_action}" disabled="true" update="formulario"/>
                                                <p:commandButton id="btnEliminar" value="Eliminar" binding="#{fichasVista.btnEliminar}" onclick="PF('confirmation').show()" disabled="true" type="button" />
                                                <p:commandButton id="btnLimpiar" value="Limpiar" binding="#{fichasVista.btnLimpiar}" action="#{fichasVista.limpiar_action}" update="formulario" />
                                            </div>
                                        </f:facet> 
                                    </p:panelGrid>

                                    <p:dataTable id="listaFichas" var="fichas" value="#{fichasVista.listaFichas}" selection="#{fichasVista.selectedFicha}"
                                                 selectionMode="single" rowKey="#{fichas.ficha}" paginator="true" rows="5" emptyMessage="No existen Fichas!" 
                                                 filteredValue="#{fichasVista.listaFichas}">
                                        <p:ajax event="rowSelect" listener="#{fichasVista.onRowSelect}"   
                                                update=":formulario:panelFichas" /> 
                                        <p:column sortBy="#{fichas.ficha}" filterBy="#{fichas.ficha}" filterMatchMode="contains">
                                            <f:facet name="header">
                                                <h:outputText  value="Ficha" />                            
                                            </f:facet>
                                            <h:outputText  value="#{fichas.ficha}" />                          
                                        </p:column>

                                        <p:column sortBy="#{fichas.jornada}">
                                            <f:facet name="header">
                                                <h:outputText  value="Jornada" />                            
                                            </f:facet>
                                            <h:outputText  value="#{fichas.jornada}" />                          
                                        </p:column>

                                        <p:column sortBy="#{fichas.codigoPrograma.codigo}" filterBy="#{fichas.codigoPrograma.codigo}">
                                            <f:facet name="header" >
                                                <h:outputText  value="Código Programa" />                            
                                            </f:facet>
                                            <h:outputText  value="#{fichas.codigoPrograma.codigo}" />                          
                                        </p:column>

                                        <p:column sortBy="#{fichas.codigoPrograma.nombre}" filterBy="#{fichas.codigoPrograma.nombre}" filterMatchMode="contains">
                                            <f:facet name="header" >
                                                <h:outputText  value="Nombre Programa" />                            
                                            </f:facet>
                                            <h:outputText  value="#{fichas.codigoPrograma.nombre}" />                          
                                        </p:column>
                                    </p:dataTable>                    

                                    <!--Panel Exportar -->
                                    <p:panel header="Exportar">   
                                        <h:commandLink>
                                            <!--PDF-->
                                            <h:outputText value="PDF" />
                                            <p:dataExporter type="pdf" fileName="ListadoFichas" target="listaFichas"/>
                                        </h:commandLink>

                                        <h:outputText value=" | " />

                                        <h:commandLink>
                                            <!--EXCEL-->
                                            <h:outputText value="XLS" />
                                            <p:dataExporter type="xls" fileName="ListadoFichas" target="listaFichas"/>
                                        </h:commandLink>
                                    </p:panel>
                                </p:panel>
                                <!-- dialogo de ayuda -->
                                <p:dialog id="modalDialog" header="Ayuda" widgetVar="helpDialog" showEffect="fade" hideEffect="bounce" modal="true" dynamic="true">  
                                    <p align="justify">                       
                                        En esta página usted podrá:<br/><br/>
                                        <b>-Crear, Modificar, Eliminar y Consultar Fichas:</b> ésta opción solo está disponible para usuarios de tipo Coordinador. 
                                        Para crear una ficha basta con digitar su número y luego presionar la tecla TAB(Tabulación) o Enter. ASPERA verificará que no haya una 
                                        ficha con ese mismo número. Si existe cargará sus datos y sino usted deberá continuar llenando el formulario. Luego de clic 
                                        en el botón Crear. Para modificar o eliminar una ficha existente seleccionela de la tabla inferior.
                                        <br/><br/>
                                        <b>-Consultar y Filtrar Fichas:</b> en la tabla de resultados se pueden visualizar todas las fichas existentes. 
                                        Si desea filtrar los resultados basta con digitar en la columna Ficha un número especifico, de igual forma se puede utilizar 
                                        el filtro por Código y/o Nombre de Programa.<br/>                    
                                    </p>
                                </p:dialog>
                            </h:form>
                            <!-- Dialogo de confirmacion para el boton eliminar -->
                            <h:form id="formDialog" > 
                                <p:confirmDialog id="confirmDialog" message="Está Seguro de Eliminar el Programa?"  
                                                 header="Confirmación" severity="alert" widgetVar="confirmation">  
                                    <p:commandButton id="confirm" value="Si" oncomplete="PF('confirmation').hide()" update=":formulario:panelFichas"  
                                                     actionListener="#{fichasVista.onEliminacionConfirm}" />  
                                    <p:commandButton id="decline" value="No" onclick="PF('confirmation').hide()" type="button" />   

                                </p:confirmDialog> 
                            </h:form>
                        </p:column>
                    </p:row>
                </p:panelGrid>
            </p:panel> 
            <div>
                <h:graphicImage url="/aspera/images/asperaPie.jpg" width="100%" height="100%" alt="LogoAspera"  style="vertical-align: bottom;"/>
            </div>
        </h:body>

    </f:view>
</html>
